<template>
  <!-- 订单详情 -->
  <el-dialog
    :title="$t('page-trade-detail.dialog-info.title')"
    :visible.sync="dialogVisible"
    :close-on-click-modal="false"
  >
    <el-form ref="main-form" :model="form" label-width="150px" :inline="true">
      <h5>{{ $t('page.form.basicinformation') }}</h5>
      <!-- 交易流水号 -->
      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-tradeNo')"
        size="mini"
      >
        <el-input placeholder="" :value="form.tradeNo" readonly></el-input>
      </el-form-item>
      <!-- 商户单号 -->
      <el-form-item :label="$t('page.form.merchantsOrder')" size="mini">
        <el-input placeholder="" :value="form.orderNo" readonly></el-input>
      </el-form-item>
      <!-- 商户结算金额 -->
      <el-form-item  :label="$t('page-trade-detail.d2-crud.column-settleAmount')" size="mini">
        <el-input
          placeholder=""
          :value="form.settleCurrency + ' ' + form.settleAmount / 100"
          readonly
        ></el-input>
      </el-form-item>
      <!-- 交易状态 -->
      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-transStatus')"
        size="mini"
      >
        <el-input
          placeholder=""
          :value="form.strTransStatus"
          readonly
        ></el-input>
      </el-form-item>

      <!-- 交易网站 -->
      <el-form-item :label="$t('page-register.form.URL')"  size="mini">
        <el-input placeholder="" :value="form.mchUrl" readonly></el-input>
      </el-form-item>

 
      <!-- 交易金额 -->
      <el-form-item  :label="$t('page.form.transactionAmount')" size="mini">
        <el-input
          placeholder=""
          :value="form.mchTransCurrency + ' ' + form.mchTransAmount / 100"
          readonly
        ></el-input>
      </el-form-item>

      
      <!-- 交易手续费 -->
      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-serviceFee')"
        size="mini"
      >
        <el-input
          placeholder=""
          :value="form.settleCurrency +' '+ form.serviceFee / 100"
          readonly
        ></el-input>
      </el-form-item>

      <!-- 保证金额 -->
      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-bondAmount')"
        size="mini"
      >
        <el-input
          placeholder=""
          :value="form.settleCurrency +' '+ form.bondAmount / 100"
          readonly
        ></el-input>
      </el-form-item>

      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-perFee')"
        size="mini"
      >
        <el-input
          placeholder=""
          :value="form.settleCurrency +' '+ form.perFee / 100"
          readonly
        ></el-input>
      </el-form-item>

    <!-- 交易时间 -->
      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-createTime')"
        size="mini"
      >
        <el-input placeholder="" :value="form.createTime" readonly></el-input>
      </el-form-item>

      <!-- 拒付状态 -->
      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-isDishonour')"
        size="mini"
      >
        <el-input placeholder="" :value="form.strIsDis" readonly></el-input>
      </el-form-item>

      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-disLookIntoFee')"
        size="mini"
      >
        <el-input
          placeholder=""
          :value="form.settleCurrency +' '+ form.disLookIntoFee / 100"
          readonly
        ></el-input>
      </el-form-item>

      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-disFee')"
        size="mini"
      >
        <el-input
          placeholder=""
          :value="form.settleCurrency +' '+ form.disFee / 100"
          readonly
        ></el-input>
      </el-form-item>

      <!-- 退款状态 -->
      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-isRefund')"
        size="mini"
      >
        <el-input placeholder="" :value="form.strIsRefund" readonly></el-input>
      </el-form-item>

      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-refundFee')"
        size="mini"
      >
        <el-input
          placeholder=""
          :value="form.settleCurrency +' '+ form.refundFee / 100"
          readonly
        ></el-input>
      </el-form-item>


      
      <!-- 解冻状态 -->
      <el-form-item  :label="$t('page-trade-detail.search-box.isThaw')" size="mini">
        <el-input placeholder="" :value="form.strIsThaw" readonly></el-input>
      </el-form-item>


      <!-- 冻结状态 -->
      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-isFrozen')"
        size="mini"
      >
        <el-input placeholder="" :value="form.strIsFrozen" readonly></el-input>
      </el-form-item>

      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-transFailFee')"
        size="mini"
      >
        <el-input
          placeholder=""
          :value="form.settleCurrency +' '+ form.transFailFee / 100"
          readonly
        ></el-input>
      </el-form-item>

      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-threeDFee')"
        size="mini"
      >
        <el-input
          placeholder=""
          :value="form.settleCurrency +' '+ form.threeDFee / 100"
          readonly
        ></el-input>
      </el-form-item>

            <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-threeDJudgeFee')"
        size="mini"
      >
        <el-input
          placeholder=""
          :value="form.settleCurrency +' '+ form.threeDJudgeFee / 100"
          readonly
        ></el-input>
      </el-form-item>






      <h5>{{ $t('page.form.paymentinformation') }}</h5>
      <!-- 支付方式 -->

      <!-- 卡号 -->
      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-cardNo')"
        size="mini"
      >
        <el-input placeholder="" :value="form.receive.cardNo" readonly></el-input>
      </el-form-item>

      <!-- 持卡人姓名 -->

      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-receive-cardFullName')"
        size="mini"
      >
        <el-input
          placeholder=""
          :value="form.receive ? form.receive.cardFullName : ''"
          readonly
        ></el-input>
      </el-form-item>

      <!-- 持卡人邮箱 -->
      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-receive-cardEmail')"
        size="mini"
      >
        <el-input
          placeholder=""
          :value="form.receive ? form.receive.cardEmail : ''"
          readonly
        ></el-input>
      </el-form-item>

      <!-- 持卡人手机 -->
      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-receive-cardFullPhone')"
        size="mini"
      >
        <el-input
          placeholder=""
          :value="form.receive ? form.receive.cardFullPhone : ''"
          readonly
        ></el-input>
      </el-form-item>

      <!-- 持卡人国家 -->
      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-receive-cardCountry')"
        size="mini"
      >
        <el-input
          placeholder=""
          :value="form.receive ? form.receive.cardCountry : ''"
          readonly
        ></el-input>
      </el-form-item>
      
      <!-- IP -->
      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-ipAddress')"
        size="mini"
      >
        <el-input placeholder="" :value="form.ipAddress" readonly></el-input>
      </el-form-item>
      <!-- 卡种 -->
      <el-form-item
        :label="$t('page-trade-detail.d2-crud.column-cardType')"
        size="mini"
      >
        <el-input placeholder="" :value="form.receive.cardType" readonly></el-input>
      </el-form-item>


      <!-- 单笔手续费 -->
      <!-- <el-form-item :label="$t('page-trade-detail.d2-crud.column-perFee')" size="mini">
        <el-input placeholder="" :value="form.perFee / 100" readonly></el-input>
      </el-form-item> -->

      <!-- <el-divider></el-divider> -->

      <!-- 交易返回信息 -->
      <!-- <el-form-item :label="$t('page-trade-detail.d2-crud.column-respMsg')" size="mini">
        <el-input placeholder="" :value="form.respMsg" readonly></el-input>
      </el-form-item> -->

      <!-- 交易通道 -->
      <!-- <el-form-item :label="$t('page-trade-detail.d2-crud.column-channelName')" size="mini">
        <el-input placeholder="" :value="form.channelName" readonly></el-input>
      </el-form-item> -->

      <!-- 是否勾兑 -->
      <!-- <el-form-item :label="$t('page-trade-detail.d2-crud.column-isChecked')" size="mini">
        <el-input placeholder="" :value="form.strIsChecked" readonly></el-input>
      </el-form-item> -->
      <!-- 冻结金额 -->
      <!-- <el-form-item :label="$t('page-trade-detail.d2-crud.column-frozenAmount')" size="mini">
        <el-input placeholder="" :value="form.mchTransCurrency + ' ' + form.frozenAmount / 100" readonly></el-input>
      </el-form-item>

      <el-divider></el-divider> -->
      <!-- 来源(支付网站) -->
      <!-- <el-form-item :label="$t('page-trade-detail.d2-crud.column-payWebSite')" size="mini">
        <el-input placeholder="" :value="form.payWebSite" readonly></el-input>
      </el-form-item> -->

      <!-- 收货人国家 -->
      <!-- <el-form-item :label="$t('page-trade-detail.d2-crud.column-receive-grCountry')" size="mini">
        <el-input placeholder="" :value="form.receive ? form.receive.grCountry : ''" readonly></el-input>
      </el-form-item> -->

      <!-- 收货人省份 -->
      <!-- <el-form-item :label="$t('page-trade-detail.d2-crud.column-receive-grState')" size="mini">
        <el-input placeholder="" :value="form.receive ? form.receive.grState : ''" readonly></el-input>
      </el-form-item> -->

      <!-- 收货人邮编 -->
      <!-- <el-form-item :label="$t('page-trade-detail.d2-crud.column-receive-grZipCode')" size="mini">
        <el-input placeholder="" :value="form.receive ? form.receive.grZipCode : ''" readonly></el-input>
      </el-form-item> -->

      <!-- 物流公司 -->
      <!-- <el-form-item :label="$t('page-trade-detail.d2-crud.column-logistics-company')" size="mini">
        <el-input placeholder="" :value="form.logistics && form.logistics.logisticsCompany ? form.logistics.logisticsCompany.shortName : ''" readonly></el-input>
      </el-form-item> -->

      <!-- 物流单号 -->
      <!-- <el-form-item :label="$t('page-trade-detail.d2-crud.column-logistics-trackNo')" size="mini">
        <el-input placeholder="" :value="form.logistics ? form.logistics.trackNo : ''" readonly></el-input>
      </el-form-item> -->
    </el-form>

    <div slot="footer" class="dialog-footer">
      <!-- 取消 -->
      <el-button @click="close" size="small">{{
        $t("page-trade-detail.dialog-info.close")
      }}</el-button>
    </div>
  </el-dialog>
</template>

<script>
import ApiMain from "@/api/trade.detail";

export default {
  mixins: [],
  props: [],
  data() {
    return {
      dialogVisible: false,
      popDeleteVisible: false,
      loading: false,

      form: {
        receive:{}
      },

      id: null,
      data: null,
    };
  },
  mounted() {},

  methods: {
    show(id = null) {
      this.id = id;

      if (this.id) {
        this.fetchData();
      } else {
        this.reset();
      }

      this.dialogVisible = true;
    },

    close() {
      this.dialogVisible = false;
      this.$emit("dialog-close");
    },

    reset() {
      this.form = {
        blackType: "",
        blackText: "",
      };
    },

    fetchData() {
      ApiMain.info({ id: this.id })
        .then((re) => {
          this.data = re;
        })
        .catch(() => {
          this.data = null;
        })
        .finally(() => {
          this.renderData();
        });
    },

    renderData() {
      this.form = this.data;
    },
  },
};
</script>

<style>
</style>
